<template>
	<div id="end">
		<div id="endbox">
			<div class="endTop">
				<img src="/static/images/news.png">
				<img src="/static/images/shezhi.png">
			</div>
			<div class="endCenter">
				<ul>
					<li>
						<div><span>- -</span></div>
						<a>会员等级</a>
					</li>
					<li>
						<img src="/static/images/login-icon.png">
					</li>
					<li>
						<div><span>- -</span></div>
						<a>伊豆</a>
					</li>
				</ul>
			</div>
			<div class="endBottom">
				<p><router-link to="/lcqUp">登录</router-link>/
				<router-link to="/lcqZhu">注册</router-link></p>

			</div>
			<div class="end-gif">
				<img src="/static/images/myIcon-bg.png">
				<span><img src="/static/images/myIcon.gif"></span>
				<p class="pppp">
					
				</p>
			</div>
			
		</div>
		<div class="endYi">
			<p><img src="/static/images/hongbao.png"><span>伊起赚</span></p>
			<p>昨日收入金额<span><img src="/static/images/jiantouyou.png"></span></p>
		</div>
		<div class="endList">
			<dl>
				<dt><img src="/static/images/money.png"></dt>
				<dd>我的收入</dd>
			</dl>
			<dl>
				<dt><img src="/static/images/fansi.png"></dt>
				<dd>粉丝团</dd>
			</dl>
			<dl>
				<dt><img src="/static/images/baobiao.png"></dt>
				<dd>报表中心</dd>
			</dl>
		</div>
		<div class="end-d">
			<p><img src="/static/images/dingdan.png"><span>我的订单</span></p>
			<p>全部订单<span><img src="/static/images/jiantouyou.png"></span></p>
		</div>
		<div class="end-m">
			<dl>
				<dt><img src="/static/images/money (2).png"></dt>
				<dd>待付款</dd>
			</dl>
			<dl>
				<dt><img src="/static/images/daifa.png"></dt>
				<dd>发货</dd>
			</dl>
			<dl>
				<dt><img src="/static/images/daishou.png"></dt>
				<dd>待收货</dd>
			</dl>
			<dl>
				<dt><img src="/static/images/daipingjia.png"></dt>
				<dd>待评价</dd>
			</dl>
			<dl>
				<dt><img src="/static/images/tuihuan.png"></dt>
				<dd>退换货</dd>
			</dl>
		</div>
		<div class="end-b">
			<p><img src="/static/images/qianbao.png"><span>我的钱包</span></p>
			<p>查看全部<span><img src="/static/images/jiantouyou.png"></span></p>
		</div>
			<div class="end-s">
				<dl>
					<dt><a>-   -</a></dt>
					<dd>伊点卡</dd>
				</dl>
				<dl>
					<dt><a>-   -</a></dt>
					<dd>积分</dd>
				</dl>
				<dl>
					<dt><a>-   -</a></dt>
					<dd>优惠券</dd>
				</dl>
			</div>
		<div class="end-l">
			<dl>
				<dt><img src="/static/images/wodetuan.png"></dt>
				<dd>我的团</dd>
			</dl>
			<dl>
				<dt><img src="/static/images/jilu.png"></dt>
				<dd>我的砍价单</dd>
			</dl>
			<dl>
				<dt><img src="/static/images/dizhi.png"></dt>
				<dd>收货地址</dd>
			</dl>
			<dl>
				<dt><img src="/static/images/qingdan.png"></dt>
				<dd>常购清单</dd>
			</dl>
			<dl>
				<dt><img src="/static/images/shoucang.png"></dt>
				<dd>我的收藏</dd>
			</dl>
			<dl>
				<dt><img src="/static/images/pingjia.png"></dt>
				<dd>我的评价</dd>
			</dl>
			<dl>
				<dt><img src="/static/images/yijufuli.png"></dt>
				<dd>一句话福利</dd>
			</dl>
		</div>
		<div class="end-F">
			<dl>
				<dt><img src="/static/images/dianka.png"></dt>
				<dd>查询伊点卡</dd>
			</dl>
			<dl>
				<dt><img src="/static/images/mendian.png"></dt>
				<dd>查询门店</dd>
			</dl>
			<dl>
				<dt><img src="/static/images/dizhi.png"></dt>
				<dd>在线客服</dd>
			</dl>
			<dl>
				<dt><img src="/static/images/jiameng.png"></dt>
				<dd>加盟来伊份</dd>
			</dl>
			<dl>
				<dt><img src="/static/images/shoucang.png"></dt>
				<dd>中奖纪录</dd>
			</dl>
			<dl>
				<dt><img src="/static/images/zizhi.png"></dt>
				<dd>增票资质</dd>
			</dl>
			<dl>
				<dt><img src="/static/images/kefu.png"></dt>
				<dd>客服热线</dd>
			</dl>
		</div>
	</div>
</template>
<script type="text/javascript">
	
</script>
<style type="text/css" scoped="">
	
	#end{
		width:100%;	
	}
	#end a{
		color: #e5e5e5;
	}
	#endbox{
		background: -webkit-linear-gradient(top,#ffb300,#ff6c30);
	}
	#end .endTop{
		width:100%;
		/*background:orange;*/
		padding-top: 0.3125rem;
		display: flex;
		justify-content: flex-end;
	}
	#end .endTop>img{
		width:.8rem;
		height:.8rem;
		margin-right: .35rem;
	}
	#end .endCenter{
		width:100%;
		/*background:orange;*/
		display: flex;
		justify-content: center;
		padding-top:-0.1px;
		padding-top: .2rem;

	}
	#end .endCenter li{
		float: left;
		text-align: center;
	}
	#end .endCenter li>img{
		width:80%;
	}
	#end .endCenter div{
		margin-top: .5rem;
		margin-bottom: .25rem
	}
	#end .endCenter li>a{
		color:#fff;

	}
	#end .endCenter div>span{
		padding:.04rem 0.4rem;
		background:#ffc600;
		border-top-right-radius: 5rem;
		border-top-left-radius:  5rem;
		border-bottom-right-radius: 5rem;
		border-bottom-left-radius: 5rem;

	}

	 #end #endbox .endBottom>p{
		color:#fff;
		font-size: .4rem;
		text-align: center;
		padding-top: .3rem
	}
	#end .endBottom p>span{
		padding: 0 .2rem;
	}
	/*#end .endBottom>img{
		width:100%;
		margin-top: .5rem;
	}*/
/*
	#end .endBottom>span{
		
		vertical-align: top;
	}*/
	.end-gif{
		width:100%;
		margin-top: .5rem;
		text-align: center;
		position: relative;
	}
	.end-gif>img{
		width:100%;
	}
	.end-gif>span{
		width:100%;
		display: block;
		position: absolute;
		top: 0;
		margin-top: -.223rem;
	}
	.end-gif>span>img{
		width:17%;
	}
	.end-gif>p{
		position: absolute;
		bottom: -.4rem;
		width: 100%;
		height: 100%;
		height: .5rem;
		background: #fff;
		z-index: 100;
	}

	.endYi{
			display: flex;
			justify-content: space-between;
			border-bottom:1px #e5e5e5 solid;
			padding-bottom: .34rem;
		}
	.endYi p>img{
		margin-top: .4rem;
		margin-right: .3rem;
		margin-left: .5rem;
		vertical-align: bottom;
	}
	.endYi p:first-of-type span{
		font-size: .38rem;
	}
	.endYi p:last-of-type {
		float:right;
		margin-top: .6rem;
		margin-right: .45rem;
	}
	
	.endYi p:last-of-type img{
		vertical-align: bottom;
	}
	#end .endList {
		width:100%;
		display: flex;
		justify-content: space-around;
		text-align: center;
		border-bottom:.28rem #e5e5e5 solid;
		padding-bottom: .4rem;
	}
	#end .endList dl{
		width:33.333%;
		margin-top: .4rem;

	} 
	#end .endList dl img{
		width:26%;
	}

	.end-d{
			display: flex;
			justify-content: space-between;
			border-bottom:1px #e5e5e5 solid;
			padding-bottom: .34rem;
		}
	.end-d p>img{
		margin-top: .4rem;
		margin-right: .3rem;
		margin-left: .5rem;
		vertical-align: bottom;
	}
	.end-d p:first-of-type span{
		font-size: .38rem;
	}
	.end-d p:last-of-type {
		float:right;
		margin-top: .6rem;
		margin-right: .45rem;
	}
	
	.end-d p:last-of-type img{
		vertical-align: bottom;
	}

	.end-m{
		width:100%;
		display: flex;
		justify-content: space-around;
		text-align: center;
		margin-top: .35rem;
		padding-bottom: .35rem;
		border-bottom:.28rem #e5e5e5 solid;
	}
	.end-m dl{
		width:20%;
	}
	.end-m dl img{
		width:45%;
	}


	.end-b{
			display: flex;
			justify-content: space-between;
			border-bottom:1px #e5e5e5 solid;
			padding-bottom: .34rem;
		}
	.end-b p>img{
		margin-top: .4rem;
		margin-right: .3rem;
		margin-left: .5rem;
		vertical-align: bottom;
	}
	.end-b p:first-of-type span{
		font-size: .38rem;
	}
	.end-b p:last-of-type {
		float:right;
		margin-top: .6rem;
		margin-right: .45rem;
	}
	
	.end-b p:last-of-type img{
		vertical-align: bottom;
	}

	.end-s {
		width:100%;
		display: flex;
		justify-content: space-around;
		text-align: center;
		margin-top: .3rem;
		padding-bottom: .3rem;
		border-bottom:.28rem #e5e5e5 solid;
	}
	.end-s dl{
		width:33.33%;
	}
	.end-s dl dt>a{
		color:orange;
		font-size: .5rem;
	}
	.end-s dl dd{
		margin-top: .2rem
	}
	 .end-l{
	 	width:100%;
	 	display: flex;
	 	flex-wrap: wrap;
	 	text-align: center;
	 	border-bottom:.35rem #e5e5e5 solid;
	 	/*padding-bottom: .32rem*/
	 }
	 .end-l dl{
	 	width:24.8%;
	 	border-right:0.015625rem #e5e5e5 solid;
	 	border-bottom:0.015625rem #e5e5e5 solid;
	 }
	 .end-l dl dt>img{
	 	width:35%;
	 }
	 .end-l dl dt{
	 	margin-top: .39rem;
	 }
	 .end-l dl dd{
	 	margin-top: .15rem;
	 	padding-bottom: .35rem
	 }
	 .end-l dl:nth-of-type(5){
	 	border-bottom: none;
	 }
	 .end-l dl:nth-of-type(6){
	 	border-bottom: none;
	 }
	 .end-l dl:nth-of-type(7){
	 	border-bottom: none;
	 }
	  .end-l{
	 	width:100%;
	 	display: flex;
	 	flex-wrap: wrap;
	 	text-align: center;
	 	border-bottom:.3rem #e5e5e5 solid;
	 	/*padding-bottom: .32rem*/
	 }
	  .end-F{
	 	width:100%;
	 	display: flex;
	 	flex-wrap: wrap;
	 	text-align: center;
	 	border-bottom:2rem #e5e5e5 solid;
	 	/*padding-bottom: .32rem*/
	 }
	 .end-F dl{
	 	width:24.8%;
	 	border-right:0.015625rem #e5e5e5 solid;
	 	border-bottom:0.015625rem #e5e5e5 solid;
	 }
	 .end-F dl dt>img{
	 	width:35%;
	 }
	 .end-F dl dt{
	 	margin-top: .39rem;
	 }
	 .end-F dl dd{
	 	margin-top: .15rem;
	 	padding-bottom: .35rem
	 }
	 .end-F dl:nth-of-type(5){
	 	border-bottom: none;
	 }
	.end-F dl:nth-of-type(6){
	 	border-bottom: none;
	 }
	 .end-F dl:nth-of-type(7){
	 	border-bottom: none;
	 }
</style>